<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>点菜</title>
    {% load staticfiles %}
    <link rel="stylesheet" href="{% static 'jquerymobile/demos/css/themes/default/jquery.mobile-1.4.5.min.css' %}">

    <script type="text/javascript" src="{% static 'jquerymobile/demos/js/jquery.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'jquerymobile/demos/js/jquery.mobile-1.4.5.min.js' %}"></script>
</head>
<body>
<div data-role="page">
    <div data-role="header" data-theme="b">
        <h1>LTM点餐平台</h1>
        <div data-role="navbar">
            <ul>
                {% for kind in kinds %}
                    <li>
                        <a href="#kind{{ kind.id }}" class="ui-btn">{{ kind.name }}</a></li>
                {% endfor %}
            </ul>
        </div>
    </div>
    <div data-role="content">
        <form method="post" action="{% url 'order:orderaciton' %}">
            {% csrf_token %}
            <ul data-role="listview">
                {% for menu in menus %}
                    <li>
                        <img src="/media/{{ menu.img }}" width="200px" height="200px"/>
                        <h2>{{ menu.name }}</h2>
                        <p>价格：{{ menu.price }}元</p>
                        <span class="ui-li-aside"><input type="checkbox" value="{{ menu.id }}"
                                                         name="checkbox_list"></span>
                    </li>
                {% endfor %}
                <input type="hidden" id="desk" class="form-control" name="desk_id" value="{{ desk_id }}">
                <input type="submit" value="提交">
            </ul>
        </form>
    </div>
    <div data-role="footer" data-position="fixed" data-theme="b">
        <div data-role="navbar">
            <ul>
                <li><a href="#" class="ui-btn ui-icon-home ui-btn-icon-top ui-corner-all">点菜</a></li>
                <li><a href="#" class="ui-btn ui-icon-bars ui-btn-icon-top ui-corner-all">订单信息</a></li>
            </ul>
        </div>
    </div>
</div>
<script>


</script>
</body>
</html>